<template>
  <div class="scroll_body">
    <div>
      <div class="title">
        案例一、Transform 方式
      </div>
      <Example1></Example1>
    </div>
    <div>
      <div class="title">
        案例二、Absolute 方式
      </div>
      <Example2></Example2>
    </div>
    <div>
      <div class="title">
        案例一、Padding 方式
      </div>
      <Example3></Example3>
    </div>
  </div>
</template>

<script>
  //  前端大数据虚拟滚动
  import Example1 from './example1.vue';
  import Example2 from './example2.vue';
  import Example3 from './example3.vue';
  export default {
    name: '',
    props: {},
    components: {
      Example1,
      Example2,
      Example3
    },
    data() {
      return {};
    },
    computed: {},
    created() {},
    mounted() {},
    methods: {},
    watch: {},
    filters: {}
  };
</script>

<style scoped lang="scss">
  .scroll_body {
    padding: 20px;
    display: flex;
    justify-content: space-around;
  }
  .title {
    line-height: 35px;
  }
</style>
